<template>
  <view class="container">
    <image class="centered-image" :src="qrUrl" mode="widthFix" show-menu-by-longpress="true" />
	<text style="font-size: 15px;color: #333;">长按扫描二维码</text>
  </view>
</template>

<script setup>
import {onLoad} from '@dcloudio/uni-app'
import {ref} from 'vue'

const qrUrl=ref('')
onLoad((option)=>{
	qrUrl.value=option.qr
})

</script>

<style>
.container {
  display: flex;
   flex-direction: column; /* 设置为列方向排列，实现上下布局 */
   justify-content: center; /* 垂直居中 */
   align-items: center; /* 水平居中 */
   max-height: 100vh;

}

.centered-image {
  width: 100%; /* 根据需要调整大小 */
  height: auto;
  margin-bottom: 10px; /* 图片和文字间距 */
}
</style>
